<template>
	<view>
		<!-- 自定义导航栏（原生导航栏不满足的情况下使用） -->
		<!-- statusBar：为true时自动留出手机上的状态栏 -->
		<uni-nav-bar 
		left-icon="back" 
		rightText="发布" 
		@clickLeft="back"
		@clickRight="submit"
		:statusBar="true"
		>
			<!-- 中间标题内容 -->
			<!-- 疑问？这里使用flex不生效，原因是view宽度不是100% -->
			<view class="u-f-ajc w100" @tap="changelook">
				{{ yinsi }}
				<view class="icon iconfont icon-xialazhankai"></view>
			</view>
		</uni-nav-bar>
		
		<!-- 多行输入框 -->
		<view class="uni-textarea">
			<textarea v-model="text" placeholder="说一句话吧~" />
		</view>
		
		<!-- 上传多图 -->
		<uploadImages @upload="upload" />
		
	</view>
</template>
<script>
	import uniNavBar from '../../components/uni-nav-bar/uni-nav-bar.vue';
	import uploadImages from '../../components/common/upload-images.vue';
	export default {
		data() {
			return {
				yinsi: '所有人可见',
				yinsiArr: ['所有人可见','仅自己可见'],
				text:'',
				imglist:[]
			}
		},
		methods: {
			// 返回
			back(){
				console.log('返回');
				uni.navigateBack({ delta: 1 });
			},
			// 发布
			submit(){
				console.log('发布');
			},
			// 隐私
			changelook(){
				uni.showActionSheet({
					itemList:this.yinsiArr,
					// 此种方法最好使用箭头函数，不然获取不到this
					success:(res) => {
						this.yinsi = this.yinsiArr[res.tapIndex];
					}
				})
			},
			upload(imglist){
				this.imglist = imglist;
				console.log('上传图片');
			}
		},
		components:{
			uniNavBar,
			uploadImages
		}
	}
</script>

<style scoped>
	.w100{
		width:100%;
	}
	.uni-textarea{
		border: 1upx solid #EEEEEE;
	}
</style>
